<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="inc/taglibs.jsp" %>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <%@ include file="inc/meta.jsp" %>
    <meta name="description" content="">
    <meta name="author" content="">
    <title>添加评论</title>
    <%@ include file="inc/css.jsp" %>
</head>
<body>

<div id="posts" class="wrapper">

    <%@ include file="inc/nav.jsp" %>

    <div id="page-wrapper">
        <div class="row">
            <div class="col-lg-12">
                <h1 class="page-header">微音列表</h1>
                <h4 style="margin-left: 10px;">——添加评论</h4>
            </div>
        </div>

        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <!-- /.panel-heading -->
                    <div class="panel-body">
                        <form id="infoForm" method="post" action="common/comment/save" class="form-horizontal nice-validator n-default" role="form" novalidate="novalidate" enctype="multipart/form-data">
                            <input type="hidden" id="tempCommentSourceId" name="sourceId" value="${sourceId}"/>
                            <input type="hidden" id="tempCommentType" name="type" value="${type}"/>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">内容:</label>
                                <div class="col-sm-6" style="padding-top: 6.5px">
                                    <textarea cols="40" rows="8" class="form-control" id="content" style="resize: none" name="content" maxlength="2000" placeholder="评论内容，最多2000字"></textarea>
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">语音文件:</label>

                                <div class="col-sm-4" style="padding-top: 6.5px;">
                                    <input type="file" id="url" name="url"/>
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">图片:</label>

                                <div class="col-sm-8">
                                    <input type="file" name="cover1" id="mainImage1" style="display:none;"/>
                                    <a href="javascript:void(0);" onclick="AddImg1()">
                                        <img id="mainPicture1" src="static/images/add.jpg" style="height: 200px; width: 200px; display: inline; margin-bottom: 5px;" border="1"/>
                                    </a>
                                    <input type="file" name="cover2" id="mainImage2" style="display:none;"/>
                                    <a href="javascript:void(0);" onclick="AddImg2()">
                                        <img id="mainPicture2" src="static/images/add.jpg" style="height: 200px; width: 200px; display: inline; margin-bottom: 5px;" border="1"/>
                                    </a>
                                    <input type="file" name="cover3" id="mainImage3" style="display:none;"/>
                                    <a href="javascript:void(0);" onclick="AddImg3()">
                                        <img id="mainPicture3" src="static/images/add.jpg" style="height: 200px; width: 200px; display: inline; margin-bottom: 5px;" border="1"/>
                                    </a>
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label" style="color: red">注:</label>

                                <div class="col-sm-8" style="padding-top: 6.5px;color: #5cb85c">
                                    图片从左到右依次为第一张、第二张、第三张，请按顺序上传
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="col-sm-12" style="text-align: center">
                                    <button type="button" class="btn btn-primary" onclick="subCommentInfo()">确定添加</button>
                                    <a href="javascript:void(0)" onclick="commentGoBack()" class="btn btn-primary" role="button">返回</a>
                                </div>
                            </div>
                        </form>
                    </div>
                    <!-- /.panel-body -->

                </div>
            </div>
        </div>

    </div>
    <!-- /#page-wrapper -->

</div>
<!-- /#wrapper -->

<%@ include file="inc/footer.jsp" %>

</body>

<script type="text/javascript">
    var imageSize = 0;

    $(function () {
        $("#mainImage1").uploadPreview({
            Img: "mainPicture1",
            Width: 200,
            Height: 170
        });

        $("#mainImage2").uploadPreview({
            Img: "mainPicture2",
            Width: 200,
            Height: 170
        });

        $("#mainImage3").uploadPreview({
            Img: "mainPicture3",
            Width: 200,
            Height: 170
        });
    });

    function AddImg1() {
        // a标签绑定onclick事件
        $('#mainImage1').click();
    }

    function AddImg2() {
        // a标签绑定onclick事件
        $('#mainImage2').click();
    }

    function AddImg3() {
        // a标签绑定onclick事件
        $('#mainImage3').click();
    }

    function subCommentInfo() {
        var flag = true;
        var content = $('#content').val();
        var url = $('#url').val();
        var cover1 = $('#mainPicture1').prop('src');

        if ((null == content || content == '') && (null == url || url == '') && (null == cover1 || cover1 == '' || cover1 == _basePath + 'static/images/add.jpg' || cover1 == 'static/images/add.jpg')) {
            $leoman.notify('文字、图片、语音不能全部为空', "error");
            flag = false;
            return;
        }

        // 所有的验证通过后，执行新增操作
        if (flag) {
            $("#infoReduceDialogModal").modal("show");

            $("#infoForm").ajaxSubmit({
                url: _basePath + "common/comment/savePlus",
                dataType: "json",
                success: function (data) {
                    $('#infoReduceDialogModal').modal("hide");
                    if (data == 1) {
                        commentGoBack();
                    } else {
                        $leoman.notify("操作失败", "error");
                    }
                }
            });
        }
    }

    function commentGoBack() {
        var sourceId = $('#tempCommentSourceId').val();

        if (null == sourceId || sourceId == '') {
            window.location.href = 'backend/broadcast/index';
        } else {
            window.location.href = 'backend/broadcast/add?broadcastId=' + sourceId;
        }
    }
</script>

</html>